<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>我的位置</title>
	<link rel="stylesheet" href="../css/map.css">
	<script type="text/javascript" src="../js/cordova.js"></script> 
	<script type="text/javascript" src="../js/cordova_plugins.js"></script>
    <script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=b0Yej7joDA3tDGWsqUF3IFqGaYG4EYKd"></script>
</head>

<body>
    <div class="map">
        <div id="allmap" ></div>
        <div class="m_operation"> <span class="map-info"></span>
            <button id="back">退出</button>
        </div>
    </div>
    <script type="text/javascript">
        /*main*/
        $(function () {
        	storage = window.localStorage; 
            InitPosition();
            $("#back").click(function(){
				if(null != watchId) {
					navigator.geolocation.clearWatch(watchId);
					watchId = null;
				}
            	window.location.href="../index.html";
            });
        });
        /*初始化当前用户位置信息*/
        function InitPosition() {
            if (navigator.geolocation) {
				var options = {frequency: 6000 };
                watchId = navigator.geolocation.watchPosition(onSuccess, onError, options);
            }
            else {
                $("map-info").html("不支持定位,请打开手机定位服务");
            }
        }
        /*获取经纬度成功*/
        function onSuccess(position) {
            var latitudeValue = position.coords.latitude;
            var longitudeValue = position.coords.longitude;
            /*显示当前位置*/
            InitMap(latitudeValue, longitudeValue);
            $(".map-info").html("您当前的位置是 维度:" + latitudeValue + ",经度" + longitudeValue);
            
            var position = new Object();
            position.uid = storage["uid"];
            position.ptime = getNewDate(); 
            position.longitude=longitudeValue;
            position.latitude=latitudeValue;
            
            updatePosition(position);
        }
        
        /*获取经纬度失败*/
        function onError() {}

        function InitMap(x, y) {
           // loadApi();
            var map = new BMap.Map("allmap"); // 创建Map实例
            var point = new BMap.Point(y, x);
            map.centerAndZoom(point, 16); //初始化时，即可设置中心点和地图缩放级别。
            var marker = new BMap.Marker(point);  // 创建标注
	        map.addOverlay(marker);               // 将标注添加到地图中
	        marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
                var opts = {
                    width : 200,     // 信息窗口宽度
                    height: 50,     // 信息窗口高度
                    title : "我在这里" , // 信息窗口标题

                }
                var infoWindow = new BMap.InfoWindow("", opts);  // 创建信息窗口对象 
                marker.addEventListener("click", function(){          
                    map.openInfoWindow(infoWindow,point); //开启信息窗口
                });
            
                map.enableScrollWheelZoom(true); //启用滚轮放大缩小
                map.enableDragging(); //允许拖拽
                /*添加标尺*/
                var top_left_control = new BMap.ScaleControl({
                    anchor: BMAP_ANCHOR_TOP_LEFT
                }); // 左上角，添加比例尺
                var top_left_navigation = new BMap.NavigationControl(); //左上角，添加默认缩放平移控件
                var top_right_navigation = new BMap.NavigationControl({
                    anchor: BMAP_ANCHOR_TOP_RIGHT
                    , type: BMAP_NAVIGATION_CONTROL_SMALL
                }); //右上角，仅包含平移和缩放按钮
                map.addControl(top_left_control);        
                map.addControl(top_left_navigation);     
                map.addControl(top_right_navigation);   
            
        }

	
        function updatePosition(position){
           	$.ajax({
				url: "map_record.action",
				type:"get",
				data : {
					"position" : JSON.stringify(position),
					
				},
				jsonpCallback : "recordPositionCallback",
				dataType:"jsonp",
				success:function(data){
					if(data.status==-1){
						alert("位置更新失败");
						}
				},
				error:function(XMLHttpRequest,textStatus,errorThrown){
					alert(XMLHttpRequest.status+","+XMLHttpRequest.readyState+","+textStatus);
				}
				});  
        }

        function getNewDate(){
        	var myDate = new Date();
        	var res = myDate.getFullYear()+'-'+(myDate.getMonth()+1)+'-'+myDate.getDate()+" "+myDate.getHours()+":"+myDate.getMinutes()+":"+myDate.getMilliseconds() ;
			return res;
         }
    </script>
</body>

</html>